<template>
  <el-form :model="form" label-width="120px">
  
        
                    <JmInput jmname="普通输入：" v-model="form.name"></JmInput>
                    <JmInput type="num" jmname="数字输入：" v-model="form.age"></JmInput>
                    <JmInput type="password" jmname="密码输入：" v-model="form.password"></JmInput>
                    <JmInput type="textarea" jmname="多行输入：" v-model="form.name"></JmInput>
                    <JmInput type="date" jmname="日期输入：" v-model="form.createTime"></JmInput>
                    <JmInput type="datetime" jmname="日期时间：" v-model="form.createTime2"></JmInput>
                    <JmInput type="time" jmname="时间输入：" v-model="form.createTime3"></JmInput>
                    <in-list type="text-list" jmname="文本列表：" v-model="form.urlList"></in-list>
                    <JmInput type="slider" jmname="滑块参数：" v-model="form.widthValue"></JmInput>
                    <JmInput type="color" jmname="颜色选择：" v-model="form.color"></JmInput>
                    <JmInput type="rate" jmname="评分组件：" v-model="form.rate"></JmInput> 
             
 

      <el-form-item>
        <el-button type="primary" @click="onSubmit">Create</el-button>
        <el-button>Cancel</el-button>
      </el-form-item>
 
  </el-form>
</template>
 
<script>
import JmInput from "../../components/form/JmInput.vue";
import JmEnum from "../../components/form/JmEnum.vue";
export default {
  components: { JmInput, JmEnum },
  data() {
    return {
      form: {
         name: '',
          password: '',
          age: 18,
          createTime: '',
          createTime2: '',
          createTime3: '',
          widthValue: 20,
          color: '#409eff',
          rate: 3,
          moneyFen: 101,
          img: '',
          audio: '',
          video: '',
          file: '',
          imgList: '',
          audioList: '',
          videoList: '',
          fileList: '',
          imgVideoList: '',
          urlList: '',
          content: '',
          status: 1,
      },
      cities :[
               
            ]
    };
  },

  mounted() {
    this.getDataList();
  },
  methods: {
    // 配置信息列表初始化
    async getDataList() {
      try {
        const res = await this.$api.getRule(); 
        let ccc=[];
       
      res.rows.forEach(element => {
         let cccz=[];
         cccz["value"]=element.id;
         cccz["label"]=element.title;
         ccc.push(cccz);  
      });
      console.log(ccc)
         this.cities=ccc;

      } catch (error) {
        /*console.error(error);*/
      }
    },
    onSubmit() {
      //  console.log(this.form);
      const res = this.$api.addRule(this.form);

             this.$emit("handleClose","如果需要传值，参数写在这里"); 
      console.log(res);
    },
  },
};
</script>
<style>
.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}
.demo-tabs .custom-tabs-label .el-icon {
  vertical-align: middle;
}
.demo-tabs .custom-tabs-label span {
  vertical-align: middle;
  margin-left: 4px;
}
</style>